{% block sw_first_run_wizard_paypal_info %}
<div class="sw-first-run-wizard-paypal">
    <div
        v-if="!isInstallingPlugin"
        class="sw-first-run-wizard-paypal-info"
    >
        <img
            class="sw-first-run-wizard-paypal-info__icon"
            :src="assetFilter('/administration/administration/static/img/paypal-official-logo.svg')"
            alt=""
        >

        <h3 class="headline">
            {{ $tc('sw-first-run-wizard.paypalInfo.headline') }}
        </h3>

        <sw-container
            columns="1fr 1fr 1fr 1fr"
            class="paymethods"
        >
            <div class="paymethod">
                <mt-icon
                    name="regular-check-circle"
                    size="12px"
                />
                <span>{{ $tc('sw-first-run-wizard.paypalInfo.paymethod.paypal') }}</span>
            </div>
            <div class="paymethod">
                <mt-icon
                    name="regular-check-circle"
                    size="12px"
                />
                <span>{{ $tc('sw-first-run-wizard.paypalInfo.paymethod.debit') }}</span>
            </div>
            <div class="paymethod">
                <mt-icon
                    name="regular-check-circle"
                    size="12px"
                />
                <span>{{ $tc('sw-first-run-wizard.paypalInfo.paymethod.creditcard') }}</span>
            </div>
            <div class="paymethod">
                <mt-icon
                    name="regular-check-circle"
                    size="12px"
                />
                <span>{{ $tc('sw-first-run-wizard.paypalInfo.paymethod.invoice') }}**</span>
            </div>
        </sw-container>
        <div
            v-if="pluginInstallationFailed"
            class="sw-first-run-wizard-paypal__error"
        >
            <mt-banner
                :title="pluginError.title"
                variant="critical"
            >
                {{ pluginError.detail }}
            </mt-banner>
        </div>
        <div class="disclaimer">
            <p>{{ $tc('sw-first-run-wizard.paypalInfo.disclaimerLineOne') }}</p>
            <p>{{ $tc('sw-first-run-wizard.paypalInfo.disclaimerLineTwo') }}</p>
        </div>
    </div>
    <div
        v-else
        class="sw-first-run-wizard-paypal-install"
    >
        <sw-loader size="48px" />
        <p
            class="sw-loader-info-text"
            v-html="$tc('sw-first-run-wizard.paypalInstall.loadingMessage')"
        ></p>
    </div>
</div>
{% endblock %}
